import React from 'react';
import {Image} from 'react-native';
import {StackNavigator, TabNavigator, TabBarBottom} from 'react-navigation';

import home from './pages/home';
import vip from './pages/vip';
import articleList from './pages/circle/articleList';
import articleDetail from './pages/circle/articleDetail';
import goodsDetail from './pages/goods/goodsDetail';
import goodsList from './pages/goods/goodsList';
import flashSale from './pages/goods/flashSale';
import search from './pages/goods/search';
import price99 from './pages/goods/price99';
import recommendList from './pages/goods/recommendList';
import customer from './pages/customer/index';
import settings from './pages/customer/settings';
import editNickname from './pages/customer/editNickname';
import editPassword from './pages/customer/editPassword';
import bindAliPay from './pages/customer/bindAliPay';
import orderList from './pages/customer/orderList';
import fans from './pages/customer/fans';
import collection from './pages/customer/collection';
import about from './pages/customer/about';
import notice from './pages/customer/notice';
import advice from './pages/customer/advice';
import profit from './pages/customer/profit';
import withdrawCash from './pages/customer/withdrawCash';
import question from './pages/customer/question';
import strategy from './pages/customer/strategy';
import customService from './pages/customer/customService';
import login from './pages/passport/login';
import register from './pages/passport/register';
import share from './pages/social/share';
import invite from './pages/social/invite';

const homeIcon = require('./images/nav/icon_home.png'),
    buyIcon = require('./images/nav/icon_shopList.png'),
    vipIcon = require('./images/nav/icon_vip.png'),
    circleIcon = require('./images/nav/icon_circle.png'),
    customerIcon = require('./images/nav/icon_customer.png');

const iconList = [
    {
        key: 'homeIcon',
        img: homeIcon
    },
    {
        key: 'buyIcon',
        img: buyIcon
    },
    {
        key: 'vipIcon',
        img: vipIcon
    },
    {
        key: 'circleIcon',
        img: circleIcon
    },
    {
        key: 'customerIcon',
        img: customerIcon
    }
];

//首页
const homeStack = StackNavigator(
    {
        home: {
            screen: home,
            navigationOptions: {
                tabBarVisible: true
            }
        },
        flashSale: {
            screen: flashSale,
            navigationOptions: {
                tabBarVisible: true
            }
        },
        goodsDetail: {
            screen: goodsDetail
        },
        goodsList: {
            screen: goodsList
        },
        price99: {
            screen: price99
        },
        recommendList: {
            screen: recommendList
        },
        search: {
            screen: search
        },
        share: {
            screen: share
        },
        login: {
            screen: login
        },
        register: {
            screen: register
        }
    },
    {
        navigationOptions: {
            tabBarVisible: false,
            header: null
        }
    }
);

//限时抢购
const buyStack = StackNavigator(
    {
        flashSale: {
            screen: flashSale,
            navigationOptions: {
                tabBarVisible: true
            }
        },
        goodsDetail: {
            screen: goodsDetail
        },
        search: {
            screen: search
        },
        share: {
            screen: share
        },
        login: {
            screen: login
        },
        register: {
            screen: register
        }
    },
    {
        navigationOptions: {
            tabBarVisible: false,
            header: null
        }
    }
);
//vip
const vipStack = StackNavigator(
    {
        vip: {
            screen: vip
        }
    },
    {
        navigationOptions: {
            header: null
        }
    }
);
//圈子
const circleStack = StackNavigator(
    {
        articleList: {
            screen: articleList,
            navigationOptions: {
                tabBarVisible: true
            }
        },
        articleDetail: {
            screen: articleDetail
        },
        share: {
            screen: share
        },
        login: {
            screen: login,
            navigationOptions: {
                header: null
            }
        },
        register: {
            screen: register,
            navigationOptions: {
                header: null
            }
        }
    },
    {
        navigationOptions: {
            header: null,
            tabBarVisible: false
        }
    }
);
//用户中心
const customerStack = StackNavigator(
    {
        customer: {
            screen: customer,
            navigationOptions: {
                tabBarVisible: true
            }
        },
        settings: {
            screen: settings
        },
        editNickname: {
            screen: editNickname
        },
        editPassword: {
            screen: editPassword
        },
        bindAliPay: {
            screen: bindAliPay
        },
        fans: {
            screen: fans
        },
        orderList: {
            screen: orderList
        },
        about: {
            screen: about
        },
        advice: {
            screen: advice
        },
        notice: {
            screen: notice
        },
        collection: {
            screen: collection
        },
        profit: {
            screen: profit
        },
        withdrawCash: {
            screen: withdrawCash
        },
        question: {
            screen: question
        },
        strategy: {
            screen: strategy
        },
        invite: {
            screen: invite
        },
        goodsDetail: {
            screen: goodsDetail
        },
        goodsList: {
            screen: goodsList
        },
        search: {
            screen: search
        },
        customService: {
            screen: customService
        },
        share: {
            screen: share
        },
        login: {
            screen: login
        },
        register: {
            screen: register
        }
    },
    {
        navigationOptions: {
            header: null,
            tabBarVisible: false
        }
    }
);

export default TabNavigator(
    {
        home: {
            screen: homeStack,
            navigationOptions: {
                title: '首页'
            }
        },
        buy: {
            screen: buyStack,
            navigationOptions: {
                title: '限时抢购'
            }
        },
        vip: {
            screen: vipStack,
            navigationOptions: {
                title: '超级用户'
            }
        },
        circle: {
            screen: circleStack,
            navigationOptions: {
                title: '圈子'
            }
        },
        customer: {
            screen: customerStack,
            navigationOptions: {
                title: '我的'
            }
        }
    },
    {
        navigationOptions: ({navigation}) => ({
            tabBarIcon: ({focused, tintColor}) => {
                const {routeName} = navigation.state;
                let iconName = `${routeName}Icon`,
                    currentIcon = iconList.filter(item => item.key === iconName);
                if (currentIcon.length) {
                    currentIcon = currentIcon[0];
                }
                return <Image source={currentIcon['img']}
                              style={{width: 25, height: 25}}/>;
            },
        }),
        tabBarOptions: {
            activeTintColor: '#f9366b',
            inactiveTintColor: '#7b7a7a'
        },
        tabBarComponent: TabBarBottom,
        tabBarPosition: 'bottom',
        animationEnabled: false,
        swipeEnabled: false
    }
);